<template>
    <div class="login">
        <div class="longin-center">
            <div class="input-one">
                <span class="icon iconfont icon-yonghu"></span>
                <input type="text" pattern="[0-9]*" v-model="phone" placeholder="请输入手机号码"/>
            </div>
            <div class="input-one">
                <span class="icon iconfont icon-mima"></span>
                <input type="text" v-model="password" placeholder="请输入您的密码"/>
                <div class="eye" @click="toggleeye">
                    <span class="icon iconfont icon-zhengyan" v-if="eye"></span>
                    <span class="icon iconfont icon-biyan" v-if="!eye"></span>
                </div>
            </div>
            <x-button class="btn-login" @click.native="tologin">登录</x-button>
        </div>
        
    </div>
</template>

<script>
import { XInput,Group,XButton } from 'vux'
export default {
    data(){
        return{
            phone:'',
            password:'',
            eye:true
        }
    },
    computed:{
        eyestatus() {
            if(this.eye){
                return 'text';
            }else{
                return 'password';
            }
        }
    },
    components:{
        XInput,
        Group,
        XButton
    },
    methods:{
        toggleeye(){
            this.eye = !this.eye;
        },
        tologin(){
            if(this.phone == '' || this.password == ''){
                this.msgtoast('用户名或密码不能是空','bottom')
            }else{
                let params = { 'name':this.phone,'password':this.password}
                this.ajaxplugin('/Deliver/login',params,(res) => {
                    this.saveLogin(res.data.access_token)
                    this.$router.push('/order');
                })
            }
            console.log(this.phone + this.password)
        }
    }
}
</script>

<style lang="stylus" scoped>

</style>
